<template>
  <div class="content" style="padding-top: 12px;">
    <van-pull-refresh v-model="refreshing" @refresh="refresh">
      <van-list v-model:loading="loading" :finished="finished" @load="loadData">
        <vid-item v-for="item in list" :key="item.id" :item="item" @view="handleItemView" />
      </van-list>
      <van-empty v-if="!list.length && !loading" description="没有关注" />
    </van-pull-refresh>
  </div>
</template>

<script setup lang="ts">
import usePage from '@/hooks/usePage.ts'
import VidServe from '@/api/vid.ts'
import VidItem from './vidItem.vue'

const { page, list, loading, finished, query, refreshing, refresh } = usePage(VidServe.favlist)

const loadData = () => {
  return query()
}

const emit = defineEmits(['view'])

const handleItemView = item => {
  emit('view', item)
}
</script>

<style scoped></style>
